import { Form, Row, Col, Input, Select, Button, Space, Modal } from 'antd';
import qs from 'qs';
import { useEffect, useState, forwardRef, useImperativeHandle } from 'react';
import { useHistory } from 'react-router-dom';
interface ServicerNamesProps {
  code: string;
  name: string;
}
export const DictionarySearchForm = forwardRef(
  ({ searchBtnF, indexAddF, dirTypeList }: any, ref) => {
    let history = useHistory();
    useImperativeHandle(ref, () => ({
      formRef: form,
      searchFormInit,
    }));
    const searchFormInit = (res: any = {}) => {
      form.setFieldsValue(res);
    };
    const [form] = Form.useForm();
    // const { confSysCode } = useCinfSysCode();

    const { Option } = Select;
    const [resetButtonDisabled, setResetButtonDisabled] = useState<boolean>(true);

    const onReset = () => {
      form.resetFields();
      setResetButtonDisabled(true);
    };
    const onFinish = async (values: any) => {
      searchBtnF(values);
    };
    const onValuesChange = () => {
      setResetButtonDisabled(!qs.stringify(form.getFieldsValue()));
    };
    return (
      <>
        <Form
          className="anTopSearchForm fff pad20"
          form={form}
          layout="inline"
          name="maitainSearcher"
          onFinish={onFinish}
          onValuesChange={onValuesChange}
        >
          <Form.Item label="字典类型" name="codeType" rules={[{ required: true }]}>
            <Select showSearch allowClear optionFilterProp="children" placeholder="请选择">
              {dirTypeList?.map((item: any, index: number) => {
                return (
                  <Option
                    title={item.codeTypeName + '-' + item.codeType}
                    key={item.codeType}
                    value={item.codeType}
                  >
                    {item.codeTypeName}
                  </Option>
                );
              })}
            </Select>
          </Form.Item>
          <div className="searchBtnBox">
            <div>
              <Button onClick={indexAddF}>新增</Button>
              <Button className="marg020" disabled={resetButtonDisabled} onClick={onReset}>
                重置
              </Button>
              <Button type={'primary'} htmlType="submit">
                搜索
              </Button>
            </div>
          </div>
        </Form>
      </>
    );
  }
);
